<template>
    <div id="navbar">
        <div class="navbar">
            <div class="icon" @click="goBack">
                <i class="iconfont">&#xe72d;</i>
            </div>
            <div class="title" v-text="title"></div>
        </div>
    </div>
</template>

<script>
    export default {
        props:{
            title:{
                type:String,
                default:'详情'
            }
        },
        data(){
            return{
                
            }
        },
        methods:{
            goBack(){
                if (window.history.length <= 1) {
                    this.$router.push({path:'/'})
                } else {
                    this.$router.go(-1)
                }
            }
        }
    }
</script>

<style scoped lang="scss">
@import '~styles/variable.scss';
#navbar{
    width: 7.5rem;
    margin:0 auto;
}
.navbar{
    position:fixed;
    z-index:99;
    width: 7.5rem;
    margin:0 auto;
    display:flex;
    height:0.8rem;
    line-height:0.8rem;
    background:$color-block;
    color:#fff;
    .icon{
        position:absolute;
        top:0;
        left:0.2rem;
        .iconfont{
            padding:0 0.1rem;
            font-size:0.4rem;
        }
    }
    .title{
        flex:1;
        text-align:center;
        font-size:$font-size-l;
    }
}
</style>